<template>
	<!-- <StateDemo></StateDemo> -->
	<!-- <GetterDemo></GetterDemo> -->
	<!-- <MutationDemo></MutationDemo> -->
	<!-- <ActionDemo></ActionDemo> -->
	<ModuleDemo></ModuleDemo>
</template>

<script>
	// import HelloWorld from './components/HelloWorld.vue'
	import StateDemo from "./components/StateDemo.vue";
	import GetterDemo from "./components/GetterDemo.vue";
	import MutationDemo from "./components/MutationDemo.vue";
	import ActionDemo from "./components/ActionDemo.vue";
	import ModuleDemo from "./components/ModuleDemo.vue";

	export default {
		name: "App",
		components: {
			// HelloWorld,
			StateDemo,
			GetterDemo,
			MutationDemo,
			ActionDemo,
			ModuleDemo
		},
	};
</script>

<style>
#app {
	font-family: Avenir, Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-align: center;
	color: #2c3e50;
	margin-top: 60px;
}
</style>
